<template>
  <div v-loading="loading">
    <queryHead v-if="head" :explain="explain" :result="msg" :time="time" :price="price" @query="query"/>
    <div v-if="lock" style="background-color: #fafafa;padding: 5px;border-radius: 5px">
      <table id="sfhy">
        <tr>
          <th colspan="4">身份核实</th>
        </tr>
        <tr>
          <td>身份证号</td>
          <td>{{ cardNo }}</td>
          <td>姓名</td>
          <td>{{ name }}</td>
        </tr>
        <tr>
          <td>性别</td>
          <td>{{ idCard(cardNo, 2) }}</td>
          <td>年龄</td>
          <td>{{ idCard(cardNo, 3) }}</td>
        </tr>
        <tr>
          <td>身份核验结果</td>
          <td>{{ hyjg }}</td>
          <td>出生日期</td>
          <td>{{ idCard(cardNo, 1) }}</td>
        </tr>
        <tr>
          <th colspan="4">婚姻信息</th>
        </tr>
        <tr>
          <td colspan="2">查询结果</td>
          <td colspan="2">{{ hyxx }}</td>
        </tr>
      </table>
    </div>
  </div>
</template>

<script>
  import queryHead from "@/views/components/queryHead.vue";
  import {queryRecord, queryData} from "@/api/system/query";

  export default {
    components: {queryHead},
    name: "hy",
    props: {
      name: {
        required: true,
        type: String
      },
      cardNo: {
        required: true,
        type: String
      },
      queryData: {
        required: true,
        type: Object
      },
      price: {
        default: null,
        type: Number
      },
      priceType: {
        default: null,
        type: Boolean
      },
      explain: {
        default: null,
        type: String
      },
      head: {
        default: true,
        type: Boolean
      }
    },
    data() {
      return {
        loading: false,
        lock: false,

        msg: undefined,
        time: undefined,

        hyjg: undefined,
        hyxx: ''
      }
    },
    created() {
      this.loading = true
      queryRecord(this.queryData).then(response => {
        this.disResponse(response)
      })
    },
    methods: {
      query() {
        this.loading = true;
        queryData(this.queryData).then(response => {
          this.disResponse(response);
        })
      },
      disResponse(response) {
        if (response.info) {
          this.time = response.time
          const info = JSON.parse(response.info)
          const smrz = info.smrz
          if (smrz.retcode == '000000') {
            if (smrz.retdata.final_valid_result == '0') {
              this.hyjg = '姓名，身份证号一致'
            } else {
              this.hyjg = smrz.retmsg
            }
          }
          const hyhy = info.hyhy
          if (hyhy.retcode == '000000') {
            this.hyxx = hyhy.retdata.messge
          }
          this.msg = "查询完成"
          this.lock = true
        }
        this.loading = false
      },

      idCard(UUserCard, num) {
        if (num === 1) {
          //获取出生日期
          const birth =
            UUserCard.substring(6, 10) + "-" +
            UUserCard.substring(10, 12) + "-" +
            UUserCard.substring(12, 14)
          return birth
        }
        if (num === 2) {
          //获取性别
          if (parseInt(UUserCard.substr(16, 1)) % 2 === 1) {
            return '男'
          } else {
            return '女'
          }
        }
        if (num === 3) {
          const myDate = new Date()
          const age = myDate.getFullYear() - UUserCard.substring(6, 10);
          return age
        }
      }
    }
  };
</script>

<style scoped>
  #sfhy {
    border-collapse: collapse;
    margin: 0 auto;
    width: 100%;
  }

  #sfhy th, td {
    text-align: center;
    /*border: 1px solid #e7e6e6;*/
    padding: 12px 0px;
    width: 25%;
  }

  td {
    background-color: #f8f8f8;
    /*color: #fff;*/
  }

  th {
    background-color: #fe7ca9;
    color: #fff;
  }
</style>
